<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>密码生成</title>
        <script type="text/javascript" src="code.js"></script>
    </head>
    <body>
        <table align="center" border="1" cellspacing="0" width="600px" height="200px">
            <tr>
                <td style="background-color: lightgrey">所用字符</td>
                <td colspan="3">
                    <input type="checkbox" name="join">a-z
                    <input type="checkbox" name="join">A-Z
                    <input type="checkbox" name="join">0-9
                    <input type="checkbox" name="join"><input type="text" name="special" size="3" value="!@#$%">
                </td>
            </tr>
            <tr>
                <td style="background-color: lightgrey">排除字符</td>
                <td colspan="3">
                    <input type="checkbox" name="delete"><input type="text" id="clear" size="20">
                </td>
            </tr>
            <tr>
                <td style="background-color: lightgrey">密码长度</td>
                <td>
                    <select id="length">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="9">9</option>
                        <option value="10">10</option>
                        <option value="11">11</option>
                        <option value="12">12</option>
                    </select>位
                </td>
                <td style="background-color: lightgrey">密码数量</td>
                <td>
                    <select id="number">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4">4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                        <option value="7">7</option>
                        <option value="8">8</option>
                        <option value="9">9</option>
                        <option value="10">10</option>
                        <option value="11">11</option>
                        <option value="12">12</option>
                    </select>个
                </td>
            </tr>
            <tr>
                <td colspan="4" style="text-align: center">
                    <button onclick="create()">生成密码</button>
                </td>
            </tr>
            <tr>
                <td colspan="4" rowspan="3" style="text-align: center">
                    <textarea id="out" cols="60" rows="10"></textarea>
                </td>
            </tr>
        </table>
    </body>
</html>